import { getLayout } from '@components/Layouts/Layout'; import PostPreview from '@components/PostPreview/PostPreview'; import { t } from '@lingui/macro'; import { NextPageWithLayout } from '@ts/types/app'; import { SubjectProps, ThematicPreview } from '@ts/types/taxonomies'; import { loadTranslation } from '@utils/helpers/i18n'; import { GetStaticPaths, GetStaticProps, GetStaticPropsContext } from 'next'; import { ParsedUrlQuery } from 'querystring'; import styles from '@styles/pages/Page.module.scss'; import { getAllSubjectsSlug, getSubjectBySlug, } from '@services/graphql/queries'; import PostHeader from '@components/PostHeader/PostHeader'; import { ArticleMeta } from '@ts/types/articles'; import ToC from '@components/ToC/ToC'; import { RelatedThematics, TopicsList } from '@components/Widget'; import { useRef } from 'react'; import Head from 'next/head'; const Subject: NextPageWithLayout = ({ subject }) => { const relatedThematics = useRef([]); const updateRelatedThematics = (newThematics: ThematicPreview[]) => { newThematics.forEach((thematic) => { const thematicIndex = relatedThematics.current.findIndex( (relatedThematic) => relatedThematic.id === thematic.id ); const hasThematic = thematicIndex === -1 ? false : true; if (!hasThematic) relatedThematics.current.push(thematic); }); }; const getPostsList = () => { return [...subject.posts].reverse().map((post) => { updateRelatedThematics(post.thematics); return (
    • ); }); }; const meta: ArticleMeta = { dates: subject.dates, website: subject.officialWebsite, }; return ( <> {subject.seo.title}
    {subject.posts.length > 0 && (

    {t`All posts in ${subject.title}`}

      {getPostsList()}
    )}
    ); }; Subject.getLayout = getLayout; interface PostParams extends ParsedUrlQuery { slug: string; } export const getStaticProps: GetStaticProps = async ( context: GetStaticPropsContext ) => { const translation = await loadTranslation( context.locale!, process.env.NODE_ENV === 'production' ); const { slug } = context.params as PostParams; const subject = await getSubjectBySlug(slug); const breadcrumbTitle = subject.title; return { props: { breadcrumbTitle, subject, translation, }, }; }; export const getStaticPaths: GetStaticPaths = async () => { const allSlugs = await getAllSubjectsSlug(); return { paths: allSlugs.map((post) => `/sujet/${post.slug}`), fallback: true, }; }; export default Subject;